<template>
	<view>
		<view class="newGoods">
			<view class="newGoods-list">
				<view class="newGoods-item" v-for="item in list" :key="item.id" @tap="toDetail(item.id)">
					<image class="newGoods-item-image" :src="item.list_pic_url" mode="widthFix"></image>
					<view class="newGoods-item-name">{{item.name}}</view>
					<view class="newGoods-item-price">{{item.retail_price | priceFormat}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: ['list'],
		name: "custom-list",
		data() {
			return {

			};
		},
		methods: {
			toDetail(id) {
				console.log(id);
				uni.navigateTo({
					url: `/pages/goodsDetail/goodsDetail?id=${id}`,
				});

			}
		}
	}
</script>

<style lang="scss">
	.newGoods {



		.newGoods-list {
			display: grid;
			grid-template-columns: 1fr 1fr;
			grid-template-rows: 480rpx;

			.newGoods-item {

				height: 480rpx;

				.newGoods-item-name {
					font-size: 27rpx;
					display: flex;
					justify-content: center;
					align-items: center;

				}

				.newGoods-item-price {
					font-size: 23rpx;
					display: flex;
					justify-content: center;
					align-items: center;
				}

				.newGoods-item-image {
					width: 100%;
					height: 188rpx;

				}
			}
		}
	}
</style>
